<template>
    <div>
      <h1>用户待处理订单</h1>
      <template>
        <el-table
          :data="notManageOrders"
          style="width: 100%"
          :row-class-name="tableRowClassName">
          <el-table-column
            prop="oname"
            label="订单名"
            width="260">
          </el-table-column>
          <el-table-column
            prop="oprice"
            label="价格"
            width="260">
          </el-table-column>
          <el-table-column
            label="操作">
            <el-button type="primary" @click="toReminder()">催单</el-button>
          </el-table-column>
        </el-table>
      </template>
    </div>
</template>

<style>
  .el-table .warning-row {
    background: oldlace;
  }

  .el-table .success-row {
    background: #f0f9eb;
  }
</style>

<script>
  import axios from 'axios';
    export default {
      name: "UserNotManageOrders",
      data() {
        return {
          titleMessage: '这是未支付订单',
          notManageOrders: [
            {
              oname: '',
              oprice:''
            }
          ]
        }
      },
      methods: {
        tableRowClassName({row, rowIndex}) {
          if (rowIndex === 1) {
            return 'warning-row';
          } else if (rowIndex === 3) {
            return 'success-row';
          }
          return '';
        },
        getNotManagerOrders(){
          var _this = this;
          axios.get('/api/orders/getNotManagerOrders').then(function (res) {
            _this.notManageOrders = res.data
          })
        },
        toReminder(){
          this.$message({
            message: '已经通知商家快速出货！',
            type: 'success'
          });
        }
      },
      mounted() {
        this.getNotManagerOrders()
      }
    }
</script>

<style scoped>

</style>
